<template>
  <el-menu background-color="#545c64" text-color="#fff" active-text-color="#ffd04b" menu-trigger="click">
    <layout-menus v-for="i in menus" :key="i.name" :menus="i" />
  </el-menu>
</template>
<script>
import { defineComponent } from 'vue';
import LayoutMenus from './layout-menus';

export default defineComponent({
  name: 'LayoutMenu',
  components: { LayoutMenus },
  props: {
    isCollapse: { type: Boolean, default: false },
  },
  setup() {
    return {
      menus: [
        {
          id: 1,
          path: '/Home',
          name: 'Home',
          // component: () => import('xxxxxx'),
          meta: {
            title: '首页',
            icon: 'Plus',
          },
          children: [
            {
              id: 10,
              path: '/aaa',
              name: 'aaaa',
              meta: {
                title: 'aaaa',
                icon: 'Plus',
              },
              children: [
                {
                  id: 111,
                  path: '/Home11',
                  name: 'Home11',
                  meta: {
                    title: '首页11',
                    icon: 'Plus',
                  },
                  children: [],
                },
              ],
            },
          ],
        },
        {
          id: 11,
          path: '/Home1',
          name: 'Home1',
          // component: () => import('xxxxxx'),
          meta: {
            title: '首页1',
            icon: 'Plus',
          },
          children: [],
        },
      ],
    };
  },
});
</script>
